<template>
	<view class="content">
		<view class="baseView">
		<uni-nav-bar left-icon="back" title="确认订单" @clickLeft="gotoBack" :border="false" color="#fff" rightIcon="headphones" right-text="客服"  backgroundColor="transparent"></uni-nav-bar>	
		</view>
		
		<view class="topView">
			
			<view v-if="sendType == '2'" class="addrG">
				<!-- 有地址 -->
				<view class="addressContent" v-if="addressData.id.length>0" @click="onClickChange">
					
					<view class="addressInfo">
						<view class="userInfo">
							<text class="name one-omit">{{addressData.contract}}</text>
							<text class="phone">{{addressData.phone}} </text>
						</view>
						<text class="address ">{{addressData.address}}</text>
					</view>
					<view class="imgG">
						<uni-icons type="compose" color="#888" size="20"></uni-icons>
						修改
					</view>
				</view>
				<!-- 无地址 -->
				<view class="address1" v-else @click="onClickChange">
					<view>您还没有创建过收货地址,点击创建一个吧</view>
					<image src="../../static/universal_dash.png" mode="widthFix"></image>
					
				</view>
			</view>
			
			<!-- 订单模块 -->
			<view class="orderPart">
				<view class="payWay">
					<view class="payWayType">
						<image src="../../static/waitpayIcon.png" mode="widthFix"></image>
						支付方式
					</view>
					<view >线上支付</view>
				</view>
				<view class="goodsInfo">
					<view class="orderGoods" v-for="(item,index) in goodsData" :key="index">
						<view class="box-thumbnail">
							<image :src="item.pic" mode="aspectFill"></image>
						</view>

						<view class="box-info">
							<view class="box-info__top">
								<view class="box-info__title ellipsis--2">
									{{item.goodsName}}
								</view>
								<view class="box-info__total_amount">
									￥{{item.price}}
								</view>
							</view>
							<view class="box-info__bottom">
								<view class="box-info__status">规格  {{item.size.data[0].value}}</view>
								<view class="box-info__num">x{{item.num}}</view>
							</view>
						</view>
					</view>
					<!--  -->
					<view class="showListMores" v-if="showListBool" @click="btnOpenListClick">
						查看更多
					</view>
				</view>
				<view class="order-info">
					<view class="common">
						<text class="text1" >运费(快递)</text>
						<text class="num" v-if="dicData.freightAmount">￥{{dicData.freightAmount}}</text>
						<text class="num" v-else>包邮</text>
					</view>
					<view class="common">
						
						<text class="text1">共{{dicData.productNum}}件商品</text>
						
						<text class="payAll">商品总价<text class="showZeroMoney">￥{{dicData.productPriceTotal}}</text></text>
					</view>
				</view>
			</view>
		</view>

		<!-- 底部结算 -->
		<view class="bottom">
			<view class="toPayView">
				<view class="dealWith">
					
					合计:<text class="showZeroMoney">￥</text>{{dicData.dealWith}}
					
				</view>
				<view class="btnPay showBtnBackColor" @click="btnGotoPayClick">
					去结算
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {

		productSuttle,
		getRemoteFigureSize,
		getCustomByCartId,
		genOrder,
		queryDefaultAddr,
		queryFeright,
		settlement

	} from '@/api/index.js'
	import {throttle} from '../../util/util.js'
	import {antiShake} from '@/util/util.js'; //防抖
	export default {
		data() {
			return {
				goodsData: [], //商品信息
				addressData: {
					id: '',
					contract: '',
					phone: '',
					address: ''
				}, //地址信息
				dicData: {
					productNum:0,//订单数量
					productPriceTotal:0,//商品总价
					dealWith:0.00,//合计
					freightAmount:0//运费
				},
				
				freightId:'',//模板ID
				goodsList: [],//上传用到的商品数
				isAgreePay:true,//是否允许调支付接口
				userId:undefined,
				showPrice:'',//自己计算的价格
				showListBool:false,
				showList:[],
				stuId:'',
				suitId:'',
				sendType:'2',//默认为2
				cartType:''
				
			}
		},
		onLoad(options) {
			
			 this.stuId = getApp().globalData.stuId
			 this.userId = getApp().globalData.userId;
			 
			
			//起商品详情来的
			if (options.cartList) {
				let goodsData = JSON.parse(decodeURIComponent(options.cartList));
				
				this.sendType = options.sendType;
				this.suitId = options.schoolId;
				this.dicData.productNum = options.orderNum;
				this.dicData.productPriceTotal = options.showPrice;
				
				this.cartType=options.cartType;

				this.requestQueryDefaultAddr(options.sendType);
				goodsData.map(v=>{
					
					v.carDetailId = v.carDetailId;
					v.oneGoodsTotalPrice=parseFloat(v.price)*parseInt(v.num);
					return v;
				})
				
				if (goodsData.length > 3) {
					this.showListBool = true
					this.showList = goodsData.slice(0,3);
					
				}else{
					this.showList = goodsData
				}
				this.goodsData  = goodsData
				
				
			}
		 

		},
		methods: {
			// 获取默认地址
			async requestQueryDefaultAddr(sendType) {
				
				if (sendType == '1') {
					// 大件到校
					let dict = {studentId: this.stuId,userId:this.userId,sendType:sendType,carType:this.cartType,presaleId:this.suitId}
				    let {result} = await queryDefaultAddr(dict)
					
				    this.freightId=result.freightId;
				    let dictAll = {appTotalPrice:this.dicData.productPriceTotal,studentId: this.stuId,userId:this.userId,freightId:result.freightId,goodsList:this.goodsData,carType:this.cartType,presaleId:this.suitId}
				    this.requestQueryFeright(dictAll);
				
				} else{
					
					
				    let dict = {studentId: this.stuId,userId:this.userId,sendType:sendType,carType:this.cartType}
				    let {result} = await queryDefaultAddr(dict)
					this.addressData = result;
					
					if (result.id) {
						
					
					
					let dictAll = {address:result.provice,appTotalPrice:this.dicData.productPriceTotal,studentId: this.stuId,userId:this.userId,goodsList:this.goodsData,carType:this.cartType}
					
					if (this.cartType == 1) {
						
					dictAll = {...dictAll,presaleId:this.suitId}
						
					}
					
					this.requestQueryFeright(dictAll);
				
					}
				}

			},
			// 获取运费
			async requestQueryFeright(dict) {
				
				let {result} = await queryFeright(dict)
				this.dicData.freightAmount = result;
				this.dicData.dealWith = (parseFloat(this.dicData.productPriceTotal)+parseFloat(result)).toFixed(2)
				
			
			},
			//切换地址
			onClickChange() {
				let _this = this
				uni.$on('address', function(data) {
					// data即为传过来的值
					console.log(data);
					 _this.addressData = data;
					 
					 let dictAll = {address: data.provice,appTotalPrice:_this.dicData.productPriceTotal,studentId: _this.stuId,userId:_this.userId,goodsList:_this.goodsData,carType:_this.cartType}
					
					if (this.cartType == 1) {
						
				      dictAll = {...dictAll,presaleId:this.suitId}
						
					}
					
					 _this.requestQueryFeright(dictAll);
				
					//清除监听，不清除会消耗资源
					uni.$off('address');
					
				});
				uni.navigateTo({
					url: '../addrList/addrList?type=pay'
				})
			},
			//提交订单
			btnGotoPayClick:throttle(function(){
				
				
				if (this.sendType == '1') {
					
					this.gotoSendTypePay();
					
					
				} else{
					this.gotoPay()
				}
				
				
				
			},1500),
			async gotoPay() {
                
					if (JSON.stringify(this.addressData) == '{}' || this.addressData == null || this.addressData.id.length == 0) {
						
						uni.showToast({
							title: '请选择收货地址',
							icon: 'none'
						})
						
						return
					
					}
					
					if (this.dicData.dealWith == 0) {
						
						uni.showToast({
							title: '订单出错,请重新尝试',
							icon: 'none'
						})
						
						return
						
					}
					
					

					//调结算接口
					const {result} = await settlement({
						address:this.addressData.address,
						appTotalPrice: this.dicData.dealWith,
						carType: this.cartType,
						contract: this.addressData.contract,
						freight: this.dicData.freightAmount,
						goodsList:this.goodsData,
						phone: this.addressData.phone,
						studentId:this.stuId,
						userId:this.userId
					})
					uni.redirectTo({
						url:'../payMent/payMent?result='+encodeURIComponent(JSON.stringify(result))
					})
					
			},
			async gotoSendTypePay(){
				
				if (this.dicData.dealWith == 0) {
					
					uni.showToast({
						title: '订单出错,请重新尝试',
						icon: 'none'
					})
					
					return
					
				}
				
				
				
				//调结算接口
				const {result} = await settlement({
					
					appTotalPrice: this.dicData.dealWith,
					carType: this.cartType,
					freight: this.dicData.freightAmount,
					goodsList:this.goodsData,
					studentId:this.stuId,
					userId:this.userId
				})
				
				if (result.izNeedPay == '0') {
					//不需要付款
					uni.redirectTo({
						url:'../orderDetail/orderDetail?orderCode='+result.code+'&fromType=waitPay'
					})
				} else{
					
					uni.redirectTo({
						url:'../payMent/payMent?result='+encodeURIComponent(JSON.stringify(result))
					})
				}
				
			},
			gotoBack(){
				
				
				uni.navigateBack({
					delta:1
				})
			},
			btnOpenListClick(){
				this.showList = this.goodsData
			},
			//微信支付
			 weixinPay(obj) {
          
				let obj1 = {
				
					'noncestr': obj.noncestr,
					'package': obj.package, // 固定值，以微信支付文档为主
					'timestamp': obj.timestamp,
					'appid': obj.appid,
					'partnerid': obj.partnerid,
					'prepayid': obj.prepayid,
					'sign': obj.sign // 根据签名算法生成签名
				}
				let orderInfo = obj1
				
				console.log('appid=',orderInfo)
				let _this = this
				// #ifdef APP-PLUS
				uni.requestPayment({
					
					provider: 'wxpay',
					orderInfo:orderInfo, 
					success: function(res) {
						console.log('success:',JSON.stringify(res));
						console.log('obj+=',_this.fromType);
						console.log('obj+=',obj);
						if(_this.fromType == 'goods') {
							uni.navigateTo({
								url: "./paySuccess?type=2&orderId=" + obj.orderId
							})
							
						} else {
							uni.navigateTo({
								url: "./paySuccess?type=1&orderId=" + obj.orderId
							})
						}
					},
					fail: function(err) {
						//跳转到代付款详情
						
						// uni.showToast({
						// 	title:'支付失败',
						// 	icon:'none'
						// })
						uni.navigateTo({
							url: '/pages/mine/orderDetail/waitPay?orderId=' + obj.orderId + '&type=2'
						})
						console.log('fail:' + JSON.stringify(err));
					}
				
				});
				// #endif
				// #ifdef MP-WEIXIN
				uni.requestPayment({
					'provider': 'wxpay',
					'nonceStr': obj.nonceStr,
					'package': obj.package, // 固定值，以微信支付文档为主
					'timeStamp': obj.timeStamp,
					'signType': 'MD5',
					'paySign': obj.sign,
					success: function(res) {
						console.log('success:' + JSON.stringify(res));
						
						if(_this.fromType == 'goods') {
							// debugger
							uni.navigateTo({
								url: "./paySuccess?type=2&orderId=" + obj.orderId
							})
							
						} else {
							uni.navigateTo({
								url: "./paySuccess?type=1&orderId=" + obj.orderId
							})
						}
						
					},
					fail: function(err) {
					
						// uni.showToast({
						// 	title:JSON.stringify(err),
						// 	icon:'none'
						// })
						uni.navigateTo({
							
							url: '/pages/mine/orderDetail/waitPay?orderId=' + obj.orderId + '&type=2'
						})
						console.log('fail:' + JSON.stringify(err));
					}
				
				});
				// #endif
				
			}
		}
	}
</script>

<style lang="less" >
	page {
		background-color: #F2f2f2;
		height: 100%;
	}
	.content {
		background-color: #F2f2f2;
		// padding: 20upx;
		height: 100%;
		
		.topView{
			padding-bottom: 100rpx;
			padding-bottom: calc(100rpx + constant(safe-area-inset-bottom));
			padding-bottom: calc(100rpx + env(safe-area-inset-bottom));
			position: relative;
			top: -260rpx;
			margin: 0 20rpx;
			
		}
		.baseView{
			padding-top:  var(--status-bar-height);
			background: linear-gradient(180deg, #8250FD 0%, #5644E5 100%);
			height: 400rpx;
			
		}

		.address1 {
			background-color: #FFFFFF;
			height: 130upx;
			background: #FFFFFF;
			// box-shadow: 0upx 2upx 10upx 0upx #EEF0F4;
			border-radius: 4upx;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
			text-align: center;
			font-size: 24upx;
			font-weight: 400;
			color: #333;
			border-radius: 16rpx;
			padding-left: 20rpx;
			padding-right: 36rpx;
			
			image{
				width: 120rpx;
				height:auto;
			}

		}
		.payWay{
		   display: flex;
		   justify-content: space-between;
		   padding: 0 30rpx;
		   height: 80rpx;
		   line-height: 80rpx;
		   color: #333;
		   font-weight: 300;
		   font-size: 26rpx;
		   background-color: #fff;
		   margin-top: 20rpx;
		   border-radius: 16rpx 16rpx 0 0;
		   
		   .payWayType image{
			   
			   width: 29rpx;
			   height: 26rpx;
			   padding-right: 15rpx;
			   position: relative;
			   top: 5rpx;
		   }
		}

		.addressContent {
			
			// margin-top: 20upx;
			padding: 0 20rpx;
			min-height: 128upx;
			background: #FFFFFF;
			box-shadow: 0upx 2upx 10upx 0upx #EEF0F4;
			border-radius: 16upx;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;

			.addressImg {
				margin-left: 18upx;
				width: 65upx;
				height: 61upx;
			}

			.addressInfo {
				// margin-left: 20upx;
				// display: flex;
				// flex-direction: column;
				
				height: 130rpx;
				
				display: flex;
				flex-direction: column;
				justify-content: space-evenly;

				.userInfo {
					display: flex;
					flex-direction: row;
					align-items: center;

					.name {
						max-width:350upx;
						font-size: 26upx;
						font-weight: 400;
						color: #333;

					}

					.phone {
						margin-left: 20upx;
						font-size: 26upx;
						font-weight: 400;
						color: #333;
					}
				}

				.address {

					font-size: 26upx;
					font-weight: 500;
					color: #333333;
					line-height: 42upx;
				}
			}
			
			.imgG{
				color: #333;
				font-size: 24rpx;
				.uni-icons{
					position: relative;
					top: 5rpx;
				}
				
			}
		}

		.orderPart {
			// background: #FFFFFF;
			// box-shadow: 0upx 2upx 10upx 0upx #EEF0F4;
			// 
			margin-top: 20rpx;
			

			.goodsInfo {
				display: flex;
				padding: 40upx 30rpx 0;
				flex-direction: column;
				background-color: #fff;
				border-radius: 0 0 16rpx 16rpx;
				// border-radius: 20upx;
				    .orderGoods:last-child{
						border-bottom: 1rpx solid #fff;
						margin-bottom: 0upx;
					}
				    .orderGoods {
				    	display: flex;
				    	flex-direction: row;
				    	margin-bottom: 40upx;
						padding-bottom: 40rpx;
						border-bottom: 1rpx solid #f2f2f2;
						
				    
				    	.box-thumbnail {
				    		width: 106upx;
				    		height: 106upx;
				    		margin-right: 20upx;

				    		image {
				    			width: 100%;
				    			height: 100%;
								border-radius: 8px;
								border: 1rpx solid #f2f2f2;
				    		}
				    	}
				    
				    	.box-info {
				    		display: flex;
				    		flex-direction: column;
				    		justify-content: space-between;
				    		flex: 1;
							
								
							.box-info__top{
								
								display: flex;
								justify-content: space-between;
								align-items: center;
								color: #333333;
								font-size: 24upx;
								font-weight: 400;
								.box-info__title {
									

								}
								.box-info__total_amount {
								
									white-space: nowrap;
									margin-left: 30rpx;
									color: #F54353;
									font-size: 30rpx;
								}
								
								
								    
							}
				    
				    
				    		.box-info__bottom {
				    			// margin-top: 10upx;
				    			display: flex;
				    			justify-content: space-between;
				    			align-items: center;
								font-size: 24upx;
								color: #999;
								font-weight: 400;
								.box-info__num{
									font-size: 28rpx;
								}
				    		}
				    	}
				    }
					
					.showListMores{
						height: 75rpx;
						text-align: center;
						font-size: 26rpx;
						color: #999999;
						// line-height: 100rpx;
					}

			}
			
			.order-info{
				padding: 20upx 30rpx;
				background-color: #fff;
				border-radius: 20upx;
				margin-top: 20rpx;
				
				.common:last-child{
					margin-top: 30rpx;
					border-top: 1rpx solid #f2f2f2;
				}
				.common {
					
					height: 70upx;
					// background-color: #007AFF;
					display: flex;
					flex-direction: row;
					justify-content: space-between;
					align-items: center;
			
					.text1 {
			
						// width: 109upx;
						height: 26upx;
						font-size: 26upx;
			
						font-weight: 400;
						color: #666;
						line-height: 32upx;
					}
			
					.num {
						font-size: 28upx;
						font-weight:500 ;
						color: #333;
						
					}
					.payAll{
						font-size: 28upx;
						color: #333;
						font-weight: 500;
						text{
							font-weight: bold;
						}
					}

				}
			}
			
		}
		
		.bottom{
			position: fixed;
			bottom: 0upx;
			bottom: constant(safe-area-inset-bottom);
			bottom: env(safe-area-inset-bottom);
			
			left: 0;
			background-color: #fff;
			width: 100%;
			
			

		.toPayView {
			display: flex;
			justify-content: space-between;
			align-items: center;
			
			height: 100upx;
			
			border-top: 1px solid #eee;
			background-color: #fff;
			
			
			.dealWith{
				color: #F54353;
				font-size: 26rpx;
				padding-left: 20rpx;
				font-weight: bold;
				// text{
					
				// }
			}

			.btnPay {
				width: 202upx;
				height: 74upx;
				border-radius: 37rpx;
				// background: #C24E4E;
				font-size: 28upx;
				color: #fff;
				display: flex;
				align-items: center;
				justify-content: center;
			}
		 }
		}

		.popup-content {
			width: 100%;
			background: #FFFFFF;
			border-radius: 20px 20px 0px 0px;
			padding-bottom: 20upx;

			.title {
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: center;
				font-size: 34upx;
				font-weight: 400;
				color: #333333;
				line-height: 48px;

				.closeIcon {
					position: absolute;
					right: 20upx;
				}
			}

			.reasons {
				margin-left: 30upx;
				margin-top: 30upx;
				margin-right: 30upx;

				.radioType {
					display: flex;
					flex-direction: row;
					justify-content: space-between;
					height: 80upx;
					color: #333333;
					font-size: 28upx;

				}
			}

			.subtitle {
				margin-left: 40upx;
				color: #999999;
				font-size: 28upx;
				height: 40upx;
			}

			.sizeDetail {
				margin-left: 30upx;
				margin-top: 30upx;
				margin-right: 30upx;
				display: flex;
				flex-direction: row;
				flex-wrap: wrap;
				justify-content: flex-start;
				align-items: center;

				.sizeItem {
					width: 33%;
					height: 100upx;
					display: flex;
					flex-direction: column;
					justify-content: center;
					align-items: center;

					// background-color: #007AFF;
					.top {
						display: flex;
						flex-direction: row;
						font-size: 32upx;
						font-weight: 400;
						color: #111111;
					}

					.name {

						font-size: 22upx;
						font-weight: 400;
						color: #999999;


					}
				}
			}
		}
	}
</style>

